@extends('layouts.back_stage')
@section('script')
    @parent
    <script type="text/javascript"
            src="https://api.map.baidu.com/api?v=2.0&ak=oqyBjKGM57Maq2jDr64qx637kMd1wb4S"></script>
@endsection
@section('style')
    @parent
    <style>
        .address {
            border-color: #cfdadd;
            border-radius: 2px;
            width: 15%;
            height: 30px;
            padding: 6px 10px;
            font-size: 12px;
            line-height: 1.42857143;
            color: #555;
            background-color: #fff;
            background-image: none;
            border: 1px solid #cfdadd;
            box-shadow: none;
            -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
            -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        }
    </style>
@endsection
@section('content')
    <script>
        var areas = [
                @foreach($areas as $v)
                    ['{{ $v->area_name }}','{{ $v->area_bh }}'],
            @endforeach
            ];
        // 省
        function getprovince() {
            var option = '';
            for( var i = 0;i< areas.length; i++)
            {
                if(areas[i][1].substr(-4) == '0000')
                {
                    option += "<<option value="+areas[i][1]+">"+areas[i][0]+"</option>>"
                }
            }
            return option;
        }
        //市
        function getcity(sign) {
            var option = '';
            for( var i = 0;i< areas.length; i++){

                if(areas[i][1].substr(-2) == '00' && areas[i][1].substr(0,2) == sign.substr(0,2) && areas[i][1].substr(-4) != '0000')
                {
                    option += "<option value="+areas[i][1]+">"+areas[i][0]+"</option>"
                }
            }
            return option;
        }
        //区
        function getcity1(sign) {
            var option = '';
            for( var i = 0;i< areas.length; i++)
            {
                if(areas[i][1].substr(-2) != '00' && areas[i][1].substr(0,4) == sign.substr(0,4))
                {
                    option += "<option value="+areas[i][1]+">"+areas[i][0]+"</option>"
                }
            }
            return option;
        }
    </script>
    <div class="container">
        <div class="row">
            <div style="padding: 20px;">
                <h3 >编辑</h3>
            </div>
            <div class="col-md-10 col-md-offset-1">
                <div style="padding: 15px 0;">
                    <label style="width:220px;line-height:30px;margin-right:10px;">手机号：<input class="form-control" style="width:160px;float:right;" type="text" maxlength="11" placeholder="请输入" name="user_tel" id="user-tel" value="{{$data->user_tel}}"></label>
                    <label style="width:230px;line-height:30px;">用户姓名：<input class="form-control" style="width:160px;float:right;" type="text" maxlength="6" placeholder="请输入" name="username" id="username" value="{{$user_info->username}}"></label>
                    {{--<input type="text" name="id" value="{{$data->id}}" id="id">--}}
                </div>
                <label style="width:220px;line-height:30px;margin-right:10px;">微信号：<input class="form-control" style="width:160px;float:right;" type="text" placeholder="请输入微信号" name="user_vx" id="user-vx" value="{{ $user_info->wechat_code }}"></label>
                <label for="">所属公司：</label>
                <select name="company_id" id="company_id" class="address" style="width:160px;">
                    <option value="{{$user_info->company_id}}">{{ $companys[$user_info->company_id] }}</option>
                    @foreach($companys as $k=>$v)
                        <option value="{{ $k }}">{{ $v }}</option>
                    @endforeach
                </select> <br>
                @if($data->is_bus == 0)
                    <div style="padding: 15px 0;">
                        <select class="address Prov" style="width:152px;">
                            <option value="{{ $area_infos['province'] }}">{{$user_info->province}}</option>
                            <script>document.write(getprovince());</script>
                            {{--@foreach ($areas as $area)--}}
                                {{--<option value="{{ $area->area_bh }}">{{ $area->area_name }}</option>--}}
                            {{--@endforeach--}}
                        </select>
                        <select class="address City" style="width:152px;">
                            <option value="{{ $area_infos['city'] }}">{{$user_info->city}}</option>
                        </select>
                        <select name='web_sel' class="address Area" style="width:152px;">
                            <option value="{{ $user_info->area_code }}">{{$user_info->distinct}}</option>
                        </select>
                    </div>
                    <label style="line-height:30px;padding: 15px 0;">详细地址：<input class="form-control" style="width:396px;float:right;" type="text" placeholder="详细地址" name="area_detail" value="{{$user_info->area_detail}}" id="area_detail"></label><br>
                    <label style="line-height:30px;padding: 15px 0;display:none;">首付比例：<input class="form-control" style="width:150px;float:right;display:none;" type="text" placeholder="首付比例(0～1)" name="first_scale" id="first_scale" value="{{$user_info->first_pro}}"></label>
                    <div class="form-group">
                        <label>是否VIP：</label>
                        <select class="address vip" style="width:80px">
                            @if($user_info->pass == 1)
                            <option value="1" selected>是</option>
                                <option value="0">否</option>
                            @else
                            <option value="0" selected>否</option><option value="1">是</option>
                            @endif
                        </select>
                    </div>
                    <div class="form-group">
                        <button type='button' class='btn btn-info ' onclick="getPoint()">获取经纬度</button>
                        <input type="hidden" id="point" name="point" value='{"lat":{{$user_info->lat}},"lng":{{$user_info->lng}}}'>
                        <input type="hidden" id="clicked">
                        <span  class="lng" style="display: none;margin-left:20px;"></span>
                    </div>
                @endif
                <textarea class="form-control remarks" placeholder="备注(最长20个字)" maxlength="20" style="width:415px;height:50px;resize:none;margin-top:20px;">{{ $user_info->describe }}</textarea>
                <button  class='btn btn-success center-block' onclick="validateUser()" style="margin-top:40px;">保存</button>
            </div>
        </div>
    </div>
    @include('errors.list')
    <script>
        /*省市区三级联动*/
        $('.Prov').change(function () {
            $('.City').html("<option value=''>市</option>");
            $('.Area').html("<option value=''>区、县</option>");
        });
        $('.Prov').change(function () {
            var id=$(this).val();
            $('.City').empty();
            $('.City').append("<option value=''>市</option>");
            $('.City').append(getcity(id));
        });
        $('.City').change(function () {
            var id= $(this).val();
            $('.Area').empty();
            $('.Area').append("<option value=''>区、县</option>");
            $('.Area').append( getcity1( id ));
        });
        var is_bus = '{{ $data->is_bus }}'
        function getPoint() {
            $('#clicked').val(1);
            var area = $('.Prov option:selected' ).text()+$('.City option:selected').text()
                    +$('.City option:selected').text()+$('#area_detail').val();
            if($("select[name=web_sel]").val() == ''){
                $(".faceImg").attr("src","/img/weep.png");
                $(".oHandle").text("请选择所在区域");
                $(".oSuccess").show(0).delay(1000).hide(0);
                return
            }else {
                //console.log(area);
                var myGeo = new BMap.Geocoder();
                myGeo.getPoint(area, function (point) {
                    //将获取的经纬度传到后台
                    //console.log(point);
                    $('#point').val(JSON.stringify(point));
                    $('.lng').html('东经：'+point.lng+'  北纬：'+point.lat);
                    $('.lng').show();
                }, $('.City option:selected').text());
            }
        }
        function validateUser() {
            var type = '{{$type}}';
            var id = '{{ $_GET['id'] }}';
            var first_scale = $('#first_scale').val();
            var username = $('#username').val();
            var wechat_code=$("#user-vx").val();
            var Prov = $('.Prov').val();
            var City = $('.City').val();
            var Area = $('.Area').val();
            var area_detail = $('#area_detail').val();
            var user_tel = $('#user-tel').val();
            var company_id = $('#company_id').val();
            var point = $('#point').val();
            var describe=$(".remarks").val();
            if(is_bus == 0){
                var pass=$(".vip").val();
            }else{
                var pass=0;
            }

            if ($('#user-tel').val() == '') {
                $(".faceImg").attr("src","/img/weep.png");
                $(".oHandle").text("手机号不能为空");
                $(".oSuccess").show(0).delay(1000).hide(0);
                return false;
            }  else if(username == ''){
                $(".faceImg").attr("src","/img/weep.png");
                $(".oHandle").text("用户名不能为空");
                $(".oSuccess").show(0).delay(1000).hide(0);
                return false;
            } else if (!(/^1[3456789]\d{9}$/.test($('#user-tel').val()))) {
                $(".faceImg").attr("src","/img/weep.png");
                $(".oHandle").text("手机格式不正确");
                $(".oSuccess").show(0).delay(1000).hide(0);
                return false;
            } else if ($("select[name=web_sel]").val() == '') {
                $(".faceImg").attr("src","/img/weep.png");
                $(".oHandle").text("请选择所在区域");
                $(".oSuccess").show(0).delay(1000).hide(0);
                return false;
            }else if( area_detail=='') {
                $(".faceImg").attr("src","/img/weep.png");
                $(".oHandle").text("请填写详细地址");
                $(".oSuccess").show(0).delay(1000).hide(0);
                return false;
            }else if( $('#clicked').val() != 1 && is_bus == 0){
                $(".faceImg").attr("src","/img/weep.png");
                $(".oHandle").text("请获取经纬度");
                $(".oSuccess").show(0).delay(1000).hide(0);
                return false;
            }
            $.ajax({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf_token"]').attr('content')
                },
                type: 'post',
                url: '/backstage/update',
                data: {
                    'id':id,
                    'company_id':company_id,
                    'first_scale':first_scale,
                    'username':username,
                    'web_select':Prov,
                    'web_select2':Area,
                    'web_select1':City,
                    'area_detail':area_detail,
                    'user_tel':user_tel,
                    'point':point,
                    'type':type,
                    'describe':describe,
                    'pass':pass,
                    'wechat_code':wechat_code
                },
                success: function (data) {
                    location.href='/backstage';
                }
            })
        }
    </script>
@endsection